<template>
	<div class="footer" v-show="bugList.length>0">
		<button class="small red button" @click="delResolved">清除已解决</button>
		<span>当前BUG总量{{bugList.length}}个,已解决{{resolvedCount}}个</span>
	</div>
</template>

<script>
	export default{
		name:'BugFooter',
		props:['bugList','delResolved'],
		data(){
		    return{
		        len:this.bugList.length
			}
		},
		computed:{
		    resolvedCount(){
		        // let count = 0;
		        // this.bugList.forEach((item)=>{
		        //     if(item.resolved)count++;
				// });
		        // return count;
				//使用es5数组的reduce方法进行对数组条件统计.
				//语法
				//this.bugList.reduce(回调函数(a,b),统计起点)
				//回调函数的效用次数和数组中元素总数有关系,数组中有三个元素,则这个回调函数被调用上次
				//a:上一次函数调用之后的返回值
				//b是遍历的对象

				// return this.bugList.reduce((a,b)=>{
                //     return a+ (b.resolved ?1:0);
                // },0)
				//简写
                return this.bugList.reduce((a,b)=>a+ (b.resolved ?1:0),0);


			}
		}
	}
</script>

<style scoped>
</style>